<template>
  <ContentWrap>
    <el-tabs v-model="activeName">
      <el-tab-pane
        v-for="paneName in paneNames"
        :key="paneName"
        :name="paneName"
        :label="$t(`cms.menu.config.${paneName}`)"
      />
    </el-tabs>
    <el-main class="p-3 app-block">
      <el-form :model="values" ref="formRef" :rules="rules" label-width="200px">
        <template v-if="activeName === 'base'">
          <el-row>
            <el-col :span="12">
              <el-form-item
                prop="port"
                :rules="{
                  type: 'number',
                  min: 0,
                  max: 65535,
                  message: () => $t('cms.rule.range', { min: 0, max: 65535 })
                }"
                ><template #label><label-tip message="cms.config.port" help /></template>
                <el-input v-model.number="values.port" style="width: 215px" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="htmlPrefix">
                <template #label><label-tip message="cms.config.htmlPrefix" help /></template>
                <el-input v-model="values.htmlPrefix" maxlength="50" style="width: 215px" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="channelUrlPrefix"
                :rules="{
                  pattern: /^\/[\w-]+$/,
                  message: () => $t('cms.config.error.channelUrlPrefixPattern')
                }"
              >
                <template #label><label-tip message="cms.config.channelUrlPrefix" help /></template>
                <el-input v-model="values.channelUrlPrefix" maxlength="50" style="width: 215px" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="contentUrlPrefix"
                :rules="{
                  pattern: /^\/[\w-]+$/,
                  message: () => $t('cms.config.error.contentUrlPrefixPattern')
                }"
              >
                <template #label><label-tip message="cms.config.contentUrlPrefix" help /></template>
                <el-input v-model="values.contentUrlPrefix" maxlength="50" style="width: 215px" />
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="activeName === 'upload'">
          <el-row>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.imageLimits"
                :rules="[
                  { required: true, message: () => t('common.required') },
                  {
                    validator: (rule: any, value: any, callback: any) => {
                      if (invalidExtension(value)) {
                        callback($t('cms.config.upload.error.extensionNotAllowd'))
                        return
                      }
                      callback()
                    }
                  }
                ]"
              >
                <template #label
                  ><label-tip message="cms.config.upload.imageLimits" help
                /></template>
                <el-input v-model="values.uploadConfig.imageLimits" maxlength="255" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.imageLimit"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.upload.imageLimit" help
                /></template>
                <el-input-number v-model="values.uploadConfig.imageLimit" :min="0" :max="65535" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.videoLimits"
                :rules="[
                  { required: true, message: () => $t('common.required') },
                  {
                    validator: (rule: any, value: any, callback: any) => {
                      if (invalidExtension(value)) {
                        callback($t('cms.config.upload.error.extensionNotAllowd'))
                        return
                      }
                      callback()
                    }
                  }
                ]"
              >
                <template #label
                  ><label-tip message="cms.config.upload.videoLimits" help
                /></template>
                <el-input v-model="values.uploadConfig.videoLimits" maxlength="255" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.videoLimit"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.upload.videoLimit" help
                /></template>
                <el-input-number v-model="values.uploadConfig.videoLimit" :min="0" :max="65535" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.audioLimits"
                :rules="[
                  { required: true, message: () => $t('common.required') },
                  {
                    validator: (rule: any, value: any, callback: any) => {
                      if (invalidExtension(value)) {
                        callback($t('cms.config.upload.error.extensionNotAllowd'))
                        return
                      }
                      callback()
                    }
                  }
                ]"
              >
                <template #label
                  ><label-tip message="cms.config.upload.audioLimits" help
                /></template>
                <el-input v-model="values.uploadConfig.audioLimits" maxlength="255" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.audioLimit"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.upload.audioLimit" help
                /></template>
                <el-input-number v-model="values.uploadConfig.audioLimit" :min="0" :max="65535" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.libraryLimits"
                :rules="[
                  { required: true, message: () => $t('common.required') },
                  {
                    validator: (rule: any, value: any, callback: any) => {
                      if (invalidExtension(value)) {
                        callback($t('cms.config.upload.error.extensionNotAllowd'))
                        return
                      }
                      callback()
                    }
                  }
                ]"
              >
                <template #label
                  ><label-tip message="cms.config.upload.libraryLimits" help
                /></template>
                <el-input v-model="values.uploadConfig.libraryLimits" maxlength="255" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.libraryLimit"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.upload.libraryLimit" help
                /></template>
                <el-input-number v-model="values.uploadConfig.libraryLimit" :min="0" :max="65535" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.attachLimits"
                :rules="[
                  { required: true, message: () => $t('common.required') },
                  {
                    validator: (rule: any, value: any, callback: any) => {
                      if (invalidExtension(value)) {
                        callback($t('cms.config.upload.error.extensionNotAllowd'))
                        return
                      }
                      callback()
                    }
                  }
                ]"
              >
                <template #label
                  ><label-tip message="cms.config.upload.attachLimits" help
                /></template>
                <el-input v-model="values.uploadConfig.attachLimits" maxlength="255" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="uploadConfig.attachLimit"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.upload.attachLimit" help
                /></template>
                <el-input-number v-model="values.uploadConfig.attachLimit" :min="0" :max="65535" />
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="activeName === 'security' && useUserStore().grade >= 2">
          <el-row>
            <el-col :span="24">
              <el-form-item prop="securityConfig.passwordStrength">
                <template #label
                  ><label-tip message="cms.config.security.passwordStrength"
                /></template>
                <el-select v-model="values.securityConfig.passwordStrength" class="w-full">
                  <el-option
                    v-for="n in [0, 1, 2, 3, 4]"
                    :key="n"
                    :value="n"
                    :label="$t(`cms.config.security.passwordStrength.${n}`)"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.passwordMinLength">
                <template #label
                  ><label-tip message="cms.config.security.passwordMinLength" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.passwordMinLength"
                  :min="0"
                  :max="16"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.passwordMaxLength">
                <template #label
                  ><label-tip message="cms.config.security.passwordMaxLength" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.passwordMaxLength"
                  :min="16"
                  :max="64"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.firstLoginChangePasssword">
                <template #label
                  ><label-tip message="cms.config.security.firstLoginChangePasssword" help
                /></template>
                <el-switch v-model="values.securityConfig.firstLoginChangePasssword" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.resetChangePasssword">
                <template #label
                  ><label-tip message="cms.config.security.resetChangePasssword" help
                /></template>
                <el-switch v-model="values.securityConfig.resetChangePasssword" />
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item prop="securityConfig.weakPasswordCheck">
                <template #label
                  ><label-tip message="cms.config.security.weakPasswordCheck" help
                /></template>
                <el-switch v-model="values.securityConfig.weakPasswordCheck" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.weakPasswordProcessMode">
                <template #label
                  ><label-tip message="cms.config.security.weakPasswordProcessMode" help
                /></template>
                <el-radio-group
                  v-model="values.securityConfig.weakPasswordProcessMode"
                  class="ml-4"
                >
                  <el-radio :label="1" size="large">
                    {{ t('cms.config.security.weakPasswordProcessMode.tip') }}
                  </el-radio>
                  <el-radio :label="2" size="large">
                    {{ t('cms.config.security.weakPasswordProcessMode.fobidden') }}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item prop="securityConfig.weakPasswords">
                <template #label
                  ><label-tip message="cms.config.security.weakPasswords" help
                /></template>
                <el-input
                  v-model="values.securityConfig.weakPasswords"
                  :rows="12"
                  type="textarea"
                />
              </el-form-item>
            </el-col>
            <el-divider content-position="left" />

            <el-col :span="24">
              <el-form-item prop="securityConfig.multiLoginEnable">
                <template #label
                  ><label-tip message="cms.config.security.multiLoginEnable" help
                /></template>
                <el-switch v-model="values.securityConfig.multiLoginEnable" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.userMaxAttempts">
                <template #label
                  ><label-tip message="cms.config.security.userMaxAttempts" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.userMaxAttempts"
                  :min="0"
                  :max="100"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.userLockMinutes">
                <template #label
                  ><label-tip message="cms.config.security.userLockMinutes" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.userLockMinutes"
                  :min="1"
                  :max="1440"
                />
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item prop="securityConfig.ipMaxAttempts">
                <template #label
                  ><label-tip message="cms.config.security.ipMaxAttempts" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.ipMaxAttempts"
                  :min="0"
                  :max="999"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.inactivityLogoutEnable">
                <template #label
                  ><label-tip message="cms.config.security.inactivityLogoutEnable" help
                /></template>
                <el-switch v-model="values.securityConfig.inactivityLogoutEnable" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.inactivityLogoutTime">
                <template #label
                  ><label-tip message="cms.config.security.inactivityLogoutTime" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.inactivityLogoutTime"
                  :min="1"
                  :max="1440"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.adminIdleLock">
                <template #label
                  ><label-tip message="cms.config.security.adminIdleLock" help
                /></template>
                <el-switch v-model="values.securityConfig.adminIdleLock" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.adminIdleDays">
                <template #label
                  ><label-tip message="cms.config.security.adminIdleDays" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.adminIdleDays"
                  :min="0"
                  :max="999"
                />
              </el-form-item>
            </el-col>
            <el-divider content-position="left" />
            <el-col :span="12">
              <el-form-item prop="securityConfig.passwordMaxDays">
                <template #label
                  ><label-tip message="cms.config.security.passwordMaxDays" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.passwordMaxDays"
                  :min="0"
                  :max="999"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="securityConfig.passwordWarnDays">
                <template #label
                  ><label-tip message="cms.config.security.passwordWarnDays" help
                /></template>
                <el-input-number
                  v-model="values.securityConfig.passwordWarnDays"
                  :min="0"
                  :max="90"
                />
              </el-form-item>
            </el-col>
            <el-divider content-position="left" />
            <el-col :span="24">
              <el-form-item prop="securityConfig.twoFactor">
                <template #label
                  ><label-tip message="cms.config.security.twoFactor" help
                /></template>
                <el-switch v-model="values.securityConfig.twoFactor" />
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="activeName === 'email'">
          <el-row>
            <el-col :span="12">
              <el-form-item
                prop="emailConfig.host"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.email.host" help /></template>
                <el-input v-model="values.emailConfig.host" maxlength="50" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="emailConfig.port"
                :rules="{
                  type: 'number',
                  min: 0,
                  max: 65535,
                  message: () => $t('common.range', { min: 0, max: 65535 })
                }"
              >
                <template #label><label-tip message="cms.config.email.port" help /></template>
                <el-input v-model.number="values.emailConfig.port" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="emailConfig.username"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.email.username" help /></template>
                <el-input v-model="values.emailConfig.username" maxlength="50" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="emailConfig.password"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.email.password" help /></template>
                <el-input v-model="values.emailConfig.password" maxlength="50" show-password />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="emailConfig.from"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.email.from" help /></template>
                <el-input v-model="values.emailConfig.from" maxlength="50" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="emailConfig.timeout"
                :rules="{
                  type: 'number',
                  min: 0,
                  max: 65535,
                  message: () => $t('common.range', { min: 0, max: 65535 })
                }"
              >
                <template #label><label-tip message="cms.config.email.timeout" help /></template>
                <el-input v-model.number="values.emailConfig.timeout" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="emailConfig.ssl">
                <template #label><label-tip message="cms.config.email.ssl" help /></template>
                <el-switch v-model="values.emailConfig.ssl" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="emailConfig.verificationCodeLength">
                <template #label
                  ><label-tip message="cms.config.email.verificationCodeLength"
                /></template>
                <el-input-number
                  v-model="values.emailConfig.verificationCodeLength"
                  :min="4"
                  :max="6"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="emailConfig.verificationCodeExpires">
                <template #label
                  ><label-tip message="cms.config.email.verificationCodeExpires" help
                /></template>
                <el-input-number
                  v-model="values.emailConfig.verificationCodeExpires"
                  :min="3"
                  :max="30"
                />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item
                prop="emailConfig.subject"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.email.subject" /></template>
                <el-input v-model="values.emailConfig.subject" maxlength="100" />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item
                prop="emailConfig.text"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.email.text" help /></template>
                <el-input
                  v-model="values.emailConfig.text"
                  :rows="3"
                  type="textarea"
                  maxlength="400"
                />
              </el-form-item>
            </el-col>
            <el-divider content-position="left">{{ $t('cms.config.email.testEmail') }}</el-divider>
            <el-col :span="24">
              <el-form-item prop="emailConfig.testTo">
                <template #label><label-tip message="cms.config.email.testTo" /></template>
                <el-input v-model="values.emailConfig.testTo" maxlength="50" />
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="activeName === 'store'">
          <el-form-item prop="tplStoreConfigId">
            <template #label><label-tip message="cms.config.tplStoreConfigId" help /></template>

            <el-select v-model="values.tplStoreConfigId">
              <el-option
                v-for="item in storeConfigOptions"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item prop="uploadStoreConfigId">
            <template #label><label-tip message="cms.config.uploadStoreConfigId" help /></template>
            <el-select v-model="values.uploadStoreConfigId">
              <el-option
                v-for="item in commonStoreConfigOptions"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item prop="htmlStoreConfigId">
            <template #label><label-tip message="cms.config.htmlStoreConfigId" help /></template>
            <el-select v-model="values.htmlStoreConfigId">
              <el-option
                v-for="item in storeConfigOptions"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </template>
        <template v-if="activeName === 'register'">
          <el-row>
            <el-col :span="12">
              <el-form-item
                prop="registerConfig.enabled"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.register.enabled" /></template>
                <el-switch v-model="values.registerConfig.enabled" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="registerConfig.verifyMode"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.register.verifyMode" /></template>
                <el-select v-model="values.registerConfig.verifyMode">
                  <el-option
                    v-for="n in [1, 2, 3, 4]"
                    :key="n"
                    :label="t(`cms.config.register.verifyMode.${n}`)"
                    :value="n"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="registerConfig.usernameMinLength"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.register.usernameMinLength"
                /></template>
                <el-input-number
                  v-model="values.registerConfig.usernameMinLength"
                  :min="1"
                  :max="12"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                prop="registerConfig.usernameMaxLength"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.register.usernameMaxLength"
                /></template>
                <el-input-number
                  v-model="values.registerConfig.usernameMaxLength"
                  :min="1"
                  :max="30"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="activeName === 'other'">
          <el-row>
            <el-col :span="24">
              <el-form-item
                prop="otherConfig.memberEnabled"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label><label-tip message="cms.config.member.enabled" /></template>
                <el-switch v-model="values.otherConfig.memberEnabled" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item
                prop="otherConfig.sensitiveWordProcessModel"
                :rules="{ required: true, message: () => $t('common.required') }"
              >
                <template #label
                  ><label-tip message="cms.config.other.sensitiveWordProcessModel"
                /></template>
                <el-select v-model="values.otherConfig.sensitiveWordProcessModel">
                  <el-option
                    v-for="n in [1, 2, 3, 0]"
                    :key="n"
                    :label="t(`cms.config.other.sensitiveWordProcessModel.${n}`)"
                    :value="n"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col
              :span="24"
              v-if="
                values.otherConfig.sensitiveWordProcessModel == 0 ||
                values.otherConfig.sensitiveWordProcessModel == 1
              "
            >
              <el-form-item prop="otherConfig.sensitiveReplaceWord">
                <template #label
                  ><label-tip message="cms.config.other.sensitiveReplaceWord"
                /></template>
                <el-input
                  v-model="values.otherConfig.sensitiveReplaceWord"
                  maxlength="50"
                  style="width: 215px"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <el-form-item>
          <el-button type="primary" @click="submitForm(formRef)">保存</el-button>
          <el-button>取消</el-button>
        </el-form-item>
      </el-form>
    </el-main>
  </ContentWrap>
</template>
<script setup lang="ts" name="SystemConfig">
import type { FormInstance, FormRules } from 'element-plus'
import type { TplStoreConfig } from '@/api/cms/system/types'
import * as SystemConfigApi from '@/api/cms/system/index'
import { initConfig, baseSettings } from '@/store/modules/cmsGlobalConfig'
import { useUserStore } from '@/store/modules/user'
const formRef = ref<FormInstance>()
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const activeName = ref('base') //选项卡

const paneNames = ref(['base', 'upload', 'email', 'store', 'register', 'other'])
if (useUserStore().grade >= 2) {
  paneNames.value.push('security')
}
const config = ref<any>({})
const values = ref<any>({
  uploadConfig: {},
  securityConfig: {
    weakPasswords: []
  },
  registerConfig: {},
  emailConfig: {},
  otherConfig: {}
})
const fetchConfig = async () => {
  config.value = await SystemConfigApi.getConfig()
  values.value = config.value
}
const fetchTplConfig = async () => {
  storeConfigOptions.value = await SystemConfigApi.getStoreTplConfigs()
  commonStoreConfigOptions.value = await SystemConfigApi.getStoreConfigs()
}
const invalidExtension = (extensions: string) => {
  const blacklist = baseSettings.uploadsExtensionBlacklist.split(',')
  const extensionList = extensions.split(',')
  return blacklist.findIndex((item) => extensionList.includes(item)) >= 0
}

const storeConfigOptions = ref<TplStoreConfig[]>([])
const commonStoreConfigOptions = ref<TplStoreConfig[]>([])
const rules = reactive<FormRules>({
  storeConfigId: [
    {
      required: true,
      message: '请选择',
      trigger: 'change'
    }
  ]
})

const submitForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      handleSystemConfigUpdate()
    } else {
      console.log('error submit!', fields)
    }
  })
}
const handleSystemConfigUpdate = async () => {
  // 设置数据
  await SystemConfigApi.updateConfigApi(values.value)
  fetchConfig()
  initConfig()
  message.success(t('common.updateSuccess'))
}

// ========== 初始化 ==========
onMounted(async () => {
  await Promise.all([fetchTplConfig(), fetchConfig()])
})
</script>
